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Abstract 


Obiettivo del contributo è sfruttare il ruolo euristico della geometria mediante utilizzo di strumenti 
VPL_Visual Programming Language per la definizione, soluzione speditiva (e.g. image sampling, nesting) 
e animazione (GIF animate, video) di puzzle 2D interattivi, fruibili mediante devices, il cui utilizzo è 
molto diffuso negli ambiti educativo e terapeutico. 

Il design di tali strumenti è finalizzato alla scomposizione/ricomposizione geometrico - semantica 
(significante - significato) di regioni/silhouette di oggetti reali complessi mediante figure geometriche 
primitive. Tali prodotti possono essere fruiti mediante integrazione di QR code a supporto di testi e 
immagini narrativi e/o descrittivi per la visualizzazione e gestione dei contenuti (Digital Storytelling), e 
integrati mediante definizione algoritmica di configurazioni cinematiche. 

La principale finalità di questo studio è supportare tale attività di ricerca, dimostrandone l'efficacia 
in ambito didattico - comunicativo a diversi livelli di istruzione (primaria - superiore), attraverso la 
definizione e testing (in progress) di design tools e/o prodotti ludico - didattici sviluppati per agevolare 
i processi di formazione, apprendimento e comunicazione. 

Studi specialistici testimoniano importanti esiti relativi all'utilizzo di tali strumenti in diversi campi di 
ricerca, tra cui Al_Artificial Intelligence, Digital e Medical Humanities. Pertanto, questo studio intende 
contribuire, quale possibile fonte di ispirazione, alle attività di ricerca condotte in tali ambiti scientifici. 


Parole chiave 
Forma, discretizzazione, composizione, pattern, cinematismo 


Discretizzazione, parame- 
trizzazione e simulazione 
(GIF animata) del 
cinematismo di una figura 
piana complessa fruibile i 
mediante QR code. (Ela- Gif animata 
borazione dell'autore). 
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Introduzione 


Le capacita percettive e di orientamento spaziale sono direttamente correlate alle esperienze 
di vita quotidiana di un individuo. Pertanto, gli educatori supportano il coinvolgimento di atti- 
vità interdisciplinari che favoriscano i processi di acquisizione, comprensione e manipolazione 
mentale (scomposizione/composizione) della forma sul piano e nello spazio [Kmetova 202 |; 
Vrenna 2021; Olkun 2003]. La capacità di ristrutturare o manipolare le informazioni visive 
implica il riconoscere, trattenere e ricordare un dato elemento al variare delle configurazioni 
assunte [Baran 2019] e, con essi, la forma di partenza, favorendo lo sviluppo e l'arricchimento 
delle capacità di problem solving [Ben-Chaim et al. 1989]. Nel caso specifico, questo processo si 
traduce nel discretizzare/manipolare mentalmente la forma, indipendentemente dalle infinite 
configurazioni che la stessa può assumere in funzione della distribuzione delle parti (conser 
vazione del significato). 
| presente contributo mostra i primi esiti di uno studio in progress basato su approcci e stru- 
menti algoritmico-generativi, alla ricerca di una chiave re-interpretativa di processi consolidati 
quali potenziali fonti di ispirazione per future ricerche interdisciplinari. Tale approccio adotta, 
pertanto, una prospettiva di ricerca che trova terreno fertile nel connubio STEM (Science/Te- 
chnology/Engineering/Mathematics)-Humanities (i.e. Digital Humanities), la cui dimensione polie- 
drica sfrutta il pensiero e gli strumenti computazionali per gestione (didattica, comunicazione) 
di risorse eterogenee (testi, immagini, oggetti audiovisivi, dati multimediali, etc.). 

L'obiettivo è manipolare/valorizzare l'informazione per agevolare l'apprendimento, la comuni- 
cazione, dunque l'acquisizione e/o la divulgazione della conoscenza. 


Pragmatica della forma: scomposizione vs riconoscibilità 


L'obiettivo delle seguenti applicazioni è quello di rafforzare la relazione tra le Scienze della 
Rappresentazione e le Scienze della Formazione e della Comunicazione, sviluppando o poten- 
ziando approcci interdisciplinari e strumenti ludico-euristici che agevolino la comprensione/ 
conoscenza analitica ed operativa della forma [Cervellini 2000] a supporto di nuove modalità 
di comunicazione interattiva. 

Il segno, strumento comunicativo, è l'unita indissolubile di due elementi, significato e significante 
[de Saussure 1916], (fig. 01). La forma è la prima entità autonoma e organizzata percepita di 
cui, tra | criteri di classificazione, è notoriamente possibile distinguere il contorno, i caratteri 
geometrico-distributivi (simmetria, ripetizione, etc.), la funzione (mimetica, astratta, etc.), la 
texture, il colore. Tali caratteri strutturano la composizione della forma e guidano il processo di 
scomposizione (significante), garantendo la comunicazione del contenuto (significato). 
Rispetto alla scomposizione dell'intero in parti, ‘un approccio sintagmatico al problema deriva 
dall’assunto strutturalista che ogni segno è un'unità di forma e significato, il cui mutamento 
dell'uno ha sicuramenti effetti sul mutamento dell'altro e viceversa. Questo implica che una 
differenza di significato si produce in una differenza di distribuzione” [Petricca 2019]. 

Inoltre, il contorno/profilo relaziona e, al tempo stesso, distingue la forma (significante) dal 
contesto in cui è inserita e con il quale si relazione (significato). 

Pertanto, sulla base di tali premesse, sono stati testati/definiti strumenti e processi che suppor- 
tano il processo di semplificazione e le operazioni di scomposizione/ricomposizione di profili 
complessi con figure elementari, tali da consentire la riconoscibilità del corretto significato 


espresso dal significante [Maestri et al. 202 1]. 


Approcci ludico — euristici per la scomposizione geometrico — semantica di figure piane 


Obiettivo di questo contributo è sperimentare l'utilizzo di strumenti automatici a sup- 
porto del processo di scomposizione e trasformazione (cinematismo) di figure com- 
plesse, potenzialmente utili anche per applicazioni e sviluppi nei succitati campi di ricerca. 
In letteratura, sono presenti nuovi paradigmi di interazione inesplorati rispetto ai Meccanismi 
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Fig. 01. Semplificazione vs 
riconoscibilità della forma. 


Fig. 02. Applicazioni e 
strumenti digitali/materiali 
ludico — didattici basati 
sull'utilizzo dei Tangram. 
Da sinistra: 100| Tangram 
puzzles game pro App by 
Statlex; Tangram puzzle - 
geogebra.org/geometry; 
copertina di lo e il mio 
gatto. Un'avventura 
tangram, Rinck M.,Van 
der Linden M. (2018); 

C COOGAM Viaggio 
Tangram Puzzle con 3 Set 
Tangram Magnetico). 


di apprendimento human learning, con possibile estensione allo sviluppo di sistemi machine 
learning [Gelsomini et al. 2019]. Nel campo della computer vision (Al), gli attuali metodi di 
pre-training si concentrano sulla scomposizione e riconoscimento di immagini complesse 
caratterizzanti i diversi contesti della realtà quotidiana [Zaho et al. 2021; Zhu et al. 2015]. 
La condizione base per la ricerca di una soluzione a tale problema (human driven o machine 
driven), è rappresentata dalla modularità o dalla disponibilità di un data set finito di pezzi su 
cui basare il processo di scomposizione/composizione della figura/scena. Lomogeneita o 
l'eterogeneità delle aree, l'estensione, la texture, il colore sono tra i caratteri che supportano 
il processo di comprensione, discretizzazione e definizione del contorno apparente e delle 
parti che definiscono una figura, semplice o complessa, dunque l'attribuzione del significato 
ad una data forma (significante). On-line è possibile fruire artworks [Tadić 1982; 2019], video 
basati su Tangram animations, oppure accedere a workspace digitali (canvas+ Tangram) per 
comporre i puzzle trascinando i pezzi all'interno di regioni (figura) il cui contorno è geo- 
metrizzato in maniera da sovrapporsi perfettamente ad una composizione di tans (fig. 02). 


DISCRETIZZAZIONE RAPPRESENTAZIONE 


Interpretare complessità 
percezione ` significato = simbolo 


INFORMAZIONE 
SEGNO + CODICE 


ELABORAZIONE SISTEMI COMUNICATIVI — LINGUAGGI 
LINGUAGGIO VERBALE LINGUAGGIO GRAFICO 
UNIVERSALITÀ CODICE > ACCESSIBILITÀ/COMPRENSIONE 


ooo 


fungo ‘Simbolo ambiauo ombrello 
SOMIGLIANZA > LEGAME NON ARBITRARIO > SIGNIFICANTE/SIGNIFICATO 


DIVERSE LINGUE > AMBIGUITÀ COMUNICAZIONE 
(e.g. problema scomposizione semantica > indexing) 


Io e il mio 
GATTO 


1001 Tangram puzzles game pro = GeoGebra 
fy 2 
a = 
= | © ® 
F 


AN 9 


STRUMENTI DIGITALI STRUMENTI MATERIALI 


Sulla base di tali premesse, il presente contributo propone l'utilizzo di procedure digitali 
consolidate (Image Sampling, Clustering, Nesting, sliders animations), reinterpretate in chiave 
“ludico - euristica, sperimentale, esplorativa all'interno dell'universo delle forme cui il pen- 
siero mentalmente si può accostare, ma che solo il disegno tende direttamente a costruire 
e raffigurare” [Cervellini 2000], per la ricerca di soluzioni speditive al problema della scom- 
posizione geometrico - semantica della forma. 

In particolare, data un'immagine/scena (figure+elementi di sfondo), per procedere alla di- 
scretizzazione delle regioni sono state testate le seguenti tecniche: 

- tassellazione regolare del piano per la discretizzazione di regioni omogenee complesse 
(assenza di cinematismo — distribuzione automatica); 
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Fig. 03. Tassellazioni 
regolari e semi-regolari 
del piano. Esempi di appli- 
cazioni ludico — didattiche 
(a destra: LEADSTAR 
Montessori Tangrams 
Puzzle. HellDoler®). 


- tassellazione semi-regolare del piano (fig. 03) per la discretizzazione di figure/soggetti 
(distribuzione automatica); 

- Tangram, antico gioco cinese basato sull'interpretazione e scomposizione di figure me- 
diante distribuzione/permutazione di sette poligoni o tans (dataset finito — interpretazio- 
ne della forma); 

- discretizzazione della figura in poligoni piani individuati in funzione del cinematismo della 
figura (interpretazione della forma - animazione di sliders). 


| BA 


n 

A 

o «2 
| sette pezzi del Tangram sono suddivisi in cinque triangoli isosceli rettangoli di tre 
diverse misure, un quadrato e un parallelogramma. Il gioco consiste nel comporre 
sagome riconoscibili (animali, persone, oggetti) mediante traslazione, rotazione e ribal- 
tamento dei soli sette pezzi disponibili, senza sovrapposizioni (figg. 04, 05). Pertanto, 
il processo richiede capacità di osservazione, semplificazione e stilizzazione della for- 
ma, oltre che il riconoscimento di simmetrie e moduli. Le figure ricomposte saranno 
equi-composte, quindi equivalenti. 
| Tangram possono essere classificati in semplici e complessi. La risoluzione di puzzle 
semplici è basata sulla combinazione di traslazioni e rotazioni a comporre un'unica re- 
gione; la risoluzione di puzzle complessi necessita di più componenti di uno stesso tipo, 
vuoti, rotazioni non vincolate, ribaltamento del parallelogramma [Yamada et al. 2020]. 
In letteratura è dimostrato che il Tangram è utilizzato per allenare la mente a identi- 
ficare, classificare e analizzare la forma [Renavitasari et al. 2018; Zhu et al. 2015]. La 
soluzione di un puzzle Tangram è inevitabilmente associata alle capacità cognitive, im- 
maginative e all'intelligenza visiva. 
Con riferimento al settore disciplinare delle scienze matematiche, il Tangram è usato, 
in particolare, per supportare e sviluppare le abilità spaziali degli studenti. L'utilizzo dei 
Tangram rappresenta, pertanto, un'opportunità per lo sviluppo, in ambito ludico-di- 
dattico, di competenze di tipo STEM. | diagrammi astratti, tra cui icone e simboli, sup- 
portano la comprensione e comunicazione della complessità del mondo reale. Oltre 
che in ambito didattico, infatti, il Tangram è utilizzato in campo medico, e.g. sviluppo di 
metodi di rieducazione visiva, o come strumento di supporto per bambini e adole- 
scenti affetti da disturbi del neurosviluppo NDD_ Neuro-Developmental Disorder, tra 
cui il Disturbo da Deficit di Attenzione e Iperattività (ADHD), il Disturbo dello Spettro 
Autistico (ASD) e la Sindrome di Down [Gelsomini et al. 2019]. Il meccanismo alla 
base del comportamento umano nel riconoscimento/composizione della forma (e.g. 
gioco del Tangram) rappresenta, inoltre, un processo automatico digitale base per l'ad- 
destramento reti neurali [Zaho et al. 2021]. A tale proposito, la letteratura sul tema 
riporta i dati relativi ai tempi massimi necessari per la risoluzione dei Tangram puzzle 
da parte di un campione di partecipanti adulti, distinguendo tra Tangram digitali e Tan- 
gram “a mano" [Baran 2019]. 
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Fig. 04. Tangram quadrato. 


Fig. 05.Varianti del Tan- 
gram: quadrato, ovale, a 


gettata da D'Ambrosio, 
R., Modello depositato 
nel 1986 (n. 5261 2b/86); 
a destra, rielaborazione 
composizioni tratte da 
Slocum, J., Gebhardt, 

D. (2022). The Anchor 
Puzzle Book. Indiana 
University Press. 


cuore, circolare. A sinistra, 
variante GRANTAM, pro- 


Di seguito, gli step che compongono il workflow definito per la scomposizione/ricom- 
posizione e animazione speditiva di figure piane complesse: 

- scomposizione semantica di un'immagine/scena (soggetto/i, oggetti, elementi di 
sfondo); 

- individuazione parametri utili per scomposizione semantica di una figura: texture/ 
colore (image sampling/clustering); 

- sampling/paneling (pattern triangolare, quadrangolare ed esagonale) preferibilmente 
di aree omogenee ed estese (e.g. elementi di sfondo), (figg. 06, 07); 

- tassellazione semi — regolare applicata a profili complessi (figure); 

- nesting di un set di figure predefinito (Tangram puzzle), (figg. 08, 09); 

- discretizzazione della figura in base alla definizione algoritmica del cinematismo: 

- creazione GIF animate; 

- creazione QR code (interattività testi). 


NDS 
RR 


KON 
PAN 
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Fig. 06. Scomposizione 
semantica di un'immagine 
(figura + sfondo). Tecnica 
di discretizzazione basata 
sulla distinzione figura 

- aree omogenee di 
sfondo. 


Fig. 07. Campionatura/ 
tassellazione (Image 
Sampling/pixelation) 

di regioni omogenee. 
Scomposizione semantica 
dell'immagine (figura + 
sfondo) con riferimento 
al parametro colore. 


da - |X) 
| | |e e 


Pertanto, sulla base delle premesse sopra riportate, è evidente che i pattern irregolari 

(e.g. Voronoi, etc.) siano esclusi in quanto composti da tasselli infinitamente differenti, 

condizione che impedisce la risoluzione del problema mediante un dataset determinato 

di pezzi. 

La risoluzione di un Tangram puzzle è un problema fortemente analogo al processo di 

packaging di una forma irregolare bidimensionale (problema NP — hard_ nondetermistic 

polynomial-time hard problem) [Yamada 2019], confrontabile con processi C&P Cutting and 

Packaging o, dunque processi di Nesting, i.e. annidamento, ((to) nest ‘‘nidificare’’) di parti 

all’interno di un profilo/contenitore bidimensionale complesso. 

Il nesting è, infatti, più semplicemente definito come il posizionamento efficiente di forme 

multiple del pezzo su una data area di una superficie. | software (open source) testati per 

le seguenti applicazioni di Nesting dei tans all'interno delle regioni individuate mediante 

semplificazione di oggetti sono OpenNest e Nest&Cut (figg. 08, 09). 

Il workflow alla base della risoluzione di Tangram puzzle mediante Nesting dei tans all'inter- 

no di regioni complesse sono: 

- individuazione/isolamento del profilo da scomporre/ricomporre; 

- upload dei tans all'interno della piattaforma open source (Nest&Cut) /definizione VPL (e.g. 
OpenNest); 

- upload della regione/profilo per il Nesting dei tans; 

- impostazione parametri di ottimizzazione (distanza tans = 0, tempi); 

- Nesting. 
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Fig. 08. Schermata del 
software Nest&Cut. 
Testing del Nesting per la 
discretizzazione automati- 
ca di profili complessi. 
Upload dei tans (pezzi) e 
della sagoma della lastra 
(profilo del cigno). 


Fig. 09. Semplificazione 
progressiva della sagoma 
del cigno (‘lastra da 
sottoporre al taglio”) per 
agevolare il Nesting auto- 
matico dei tans all'interno 
del profilo. Software: 
Nest&Cut. 


pe teron nona tye ba gn. 
‘Taco Dacor) oer pr 


© Taglio 
Bom L om won 


pezzo tibet perso 2a 


MATERIALE Miglior risultato di nesting 


(richiede più tempo) 
ì sità 
8 


pemasa perm pezzo bet perso 7a 


== ua ens 
® z z 
Lastre importate © Anteprima 
nest&crt. 
NOME FILE | quantità $ LUNGHEZZA LARGHEZZA [E] orou neea more materiais or machines ? 
ped, Distanza pezzi Passo di rotazione 


i 0 | mm Tute lerotazion v | 
%> -0 + ED #100 68.87 mm 51.37 mm o Distanza dal bordo Consenti simmetrie 
T] = e 


Applicazione: GIF animate + QR code per Digital Storytelling 


Le GIF animate, fruibili mediante QR code da inserire su supporti cartacei (testi, pan- 

nelli, etc.) o attivabili mediante appositi widgets (testi digitali), agevolano la comunica- 

zione del messaggio. 

A tale proposito, in ambiente VPL sono state animate singole figure complesse o com- 

posizioni, discretizzate con figure semplici. L'animazione degli sliders consente la tradu- 

zione degli algoritmi definiti per generare il cinematismo dei poligoni in una sequenza 

di frames necessari per la creazione della GIF animata (figg. 00, 10). Quindi, è possibile 

animare più sliders o combinare più GIF animate per la composizione di una scena di- 

namica. In sintesi, il workflow si compone dei seguenti step: 

- discretizzazione dei profili/regioni di partenza, sfondo + figura (Paneling/Image Sam- 

pling-Nesting/Tangram); 

- parametrizzazione del cinematismo di una composizione di poligoni (azione compiuta 
dalla figura); 

- animazione degli sliders e generazione della sequenza di frames per la creazione della 
GIF animata; 

- creazione del QR code per la visualizzazione dell'animazione; 

- inserimento del QR code all'interno di testi o utilizzo delle GIF animate per la creazione 
di prodotti digitali. 
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Fig. 10. Cinematismo 
(moto composto) di un 
poligono (rotazione + 
traslazione). Sovrapposi- 
zione del poligono sulla 
sagoma discretizzata del 
cigno (Tangram puzzle). 


Fig. | |. Discretizzazione 
e cinematismo della 


sagoma dell'ala del cigno. 


Adattamento dell'algo- 
ritmo di locomozione 
di Jansen per simulare il 
cinematismo. 


Le applicazioni inserite all'interno di questo contributo sono state realizzate nell'ambito del 
Corso di Disegno digitale e Modellazione del Corso di Laurea in Design per la Comuni- 
tà_ Community Design, Dipartimento di Architettura dell'Università degli Studi di Napoli Fe- 
derico Il. In particolare, l'algoritmo VPL generato dagli studenti parametrizza il meccanismo 
di locomozione terrestre delle sculture cinetiche dell'artista olandese Theo Jansen (1948), 
basato sull'utilizzo di algoritmi evolutivi, necessario per il confronto tra migliaia di possibili 
configurazioni di moto. Gli studenti hanno testato lo strumento (discretizzazione delle figu- 
re e progettazione delle connessioni) su diversi soggetti (figg. 10, I I, 12). 


ANIMAZIONE 


Gif animata 
perno fisso J e |) 7 È yu = bh "7 
———— 
w A 


Fig. | 2. Discretizzazione e 
cinematismo del profilo 


di una farfalla. Adattamen- 


to dell'algoritmo di loco- 
mozione di Jansen per 
simulare il cinematismo. 


Gif animata 4 5 6 


Conclusioni e Future Works 


La finalità delle sperimentazioni VPL proposte all'interno di questo contributo è, dunque, 
quella di testare e fondere procedure digitali consolidate per contribuire/agevolare la crea- 
zione di prodotti ludico/didattici (GIF animate, video) a supporto/corredo di testi analogici 
o digitali, accessibili mediante QR code o widgets (Digital Storytelling). Parametrizzare nuove 
configurazioni di moto, estendere il processo di scomposizione semantica della forma dalla 
tassellazione del piano (figure piane), alla tassellazione dello spazio (composizioni di poliedri) 
e coinvolgere l'utilizzo di algoritmi genetici VPL per ottimizzare i processi di scomposizione/ 
ricomposizione della forma rappresentano dei possibili, futuri lavori di ricerca. 
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terization and simulation 
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Introduction 


Perceptual and spatial orientation skills are directly related to the individual's daily life expe- 
riences. Therefore, educators support interdisciplinary activities to improve acquisition, un- 
derstanding and mental manipulation processes (discretization/composition) of plane and 
spatial shapes [Kmetova 2021; Vrenna 2021; Olkun 2003]. Restructuring or manipulation 
of visual information capabilities involve recognizing, retaining and remembering a given 
element despite its varying configurations and their starting profile [Baran 2019]. This ap- 
proach allows for the development and improvement of problem solving skill [Ben-Chaim 
et al.1989]. More specifically, this process consists in mental discretization/manipulation of 
the shape, independently of its infinite configurations resulting from distribution of its parts 
(conservation of meaning). According to these premises, this contribution shows early out- 
comes of a work in progress based on algorithmic - generative approaches and tools aimed 
at reinterpreting consolidated processes to inspire future interdisciplinary research. There- 
fore, this research approach can be supported by the combination of STEM (Science/Tech- 
nology/Engineering/Mathematics) and Humanities, (i.e. Digital Humanities), through thinking 
and computational tools aimed at the management (teaching, communication) of hetero- 
geneous resources (texts, images, objects audiovisuals, multimedia data, etc.). The main goal 
is to manipulate/enhance information to facilitate learning, communication, acquisition and/ 


or knowledge dissemination. 


Shape Pragmatics: decomposition vs recognition 


The goal of the following applications is to enhance the relationship between Representa- 
tion Sciences and the Education and Communication Sciences, developing interdisciplinary 
approaches and playful-heuristic tools to facilitate the analytical and operational awareness/ 
knowledge of the shape [Cervellini 2000] in support of the new modalities of interactive 
communication. 

Sign as a communicative tool is the indissoluble unity of two elements, meaning and signifier 
[de Saussure 191€], (fig.01). Shape is the first perceivable autonomous and organized entity, its 
classification criteria include contour geometric - distributive characters (symmetry, repetition, 
etc.), function (mimetic, abstract, etc.), texture, color These characters structure the form and 
ead decomposition process (signifier), guaranteeing communication of content (meaning). 
According to the decomposition of the whole into parts, “a syntagmatic approach to the 
problem derives from the structuralist assumption that every sign is a unity of form and 
meaning, the change of one certainly has effects on the change of the other and vice versa. 
This means that a difference in meaning generates a difference in distribution” [Petricca 2019]. 
Furthermore, the contour / profile relates and, at the same time, distinguishes the form (signi- 
fier) from its context (signified). Therefore, according to these premises, tools and processes 
have been tested/defined to support the simplification and decomposition/recomposition 
process of complex profiles with elementary figures, to allow the recognition of the correct 
meaning expressed by the signifier [Maestri et al. 202 |]. 


Playful-heuristic approaches for the geometric-semantic decomposition of planar figures 


The aim of this contribution is to experiment with automatic tools to support the de- 
composition and transformation process (kinematics) of complex figures, poten- 
tially useful also for applications and developments in the aforementioned research 
fields. In scientific literature, there are new unexplored interaction paradigms regard- 
ing human learning mechanisms, potentially extensible to the development of ma- 
chine learning systems [Gelsomini et al. 2019]. In the computer vision (Al) field, current 
pre-training methods focus on the decomposition and recognition of complex images 
characterizing the different contexts of everyday life [Zaho et al. 2021; Zhu et al. 2015]. 
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Fig. 01. Simplification vs 
recognition. 


Fig. 02. Applications and 
digital/materials playful/ 
didactic tools based on 
Tangram. From left: 1001 
Tangram puzzles game 
pro App by Statlex; Tan- 
gram puzzle - geogebra. 
org/geometry; cover of 
the book lo e il mio gatto. 
Un'avventura tangram, by 
Rinck M.,Van der Linden 
M. 2018; C COOGAM 
Viaggio Tangram Puzzle 
con 3 Set Tangram Ma- 
gnetico). 


The basic condition for finding a solution to this problem (human driven or machine driven) 
is represented by a finite data set on which to base the process of decomposition/com- 
position of figures/scenes. Homogeneity or heterogeneity of the areas, extension, texture, 
color are among the characters that support the process of comprehension, discretization 
and definition of the apparent outline and of the parts that define a simple or complex 
figure, therefore they attribute meaning to a given form (signifier). On-line it is possible to 
enjoy artworks [Tadić 1982; 2019], videos based on Tangram animations or access digital 
workspaces (canvas + Tangram) to compose the puzzles by dragging the pieces within ge- 
ometrized regions (figure) to perfectly overlap a composition of tans (fig. 02). 


DISCRETIZZAZIONE RAPPRESENTAZIONE 


Interpretare complessita 
percezione ™ significato | simbolo 


INFORMAZIONE 
SEGNO > CODICE 
ELABORAZIONE SISTEMI COMUNICATIVI — LINGUAGGI 
LINGUAGGIO VERBALE LINGUAGGIO GRAFICO 


DIVERSE LINGUE > AMBIGUITÀ COMUNICAZIONE UNIVERSALITÀ CODICE > ACCESSIBILITA/COMPRENSIONE 


(e.g. problema scomposizione semantica > indexing) 


foro 


fungo Simbolo ambiauo ombrello 
SOMIGLIANZA > LEGAME NON ARBITRARIO > SIGNIFICANTE/SIGNIFICATO 


{ 1001 Tangram puzzles game pro = GeoGebra 
b pp 


Io e il mio 
GATTO 


STRUMENTI DIGITALI 


STRUMENTI MATERIALI 


According to these premises, this contribution proposes the use of consolidated digital 
procedures (Image Sampling, Clustering, Nesting, sliders animations), in a “playful - heuristic, 
experimental, exploratory key within the universe of forms which mentally thought can 
be approached, but that only drawing directly constructs and depicts” [Cervellini 2000], to 
find expeditious solutions to the problem of the geometric-semantic decomposition of the 
shape. More specifically, starting from an image / scene (figures + background elements), 
the following techniques were tested for regions discretization: 
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Fig. 03. Planar regular and 
semiregular tessellations. 
Playful/didactic applica- 
tions (right: LEADSTAR 
Montessori Tangrams 
Puzzle. HellDoler®). 


- regular planar tessellation to discretize complex homogeneous regions (absence of kine- 
matics-automatic distribution); 

- semi-regular planar tessellation (fig. 03) to discretize figures/subjects (automatic dis- 
tribution); 

- Tangram, ancient chinese game based on the interpretation and decomposition of figures by 
distribution/permutation of seven given polygons or tans (dataset-shape interpretation); 

- shape discretization into polygons identified as a kinematics function (shape interpreta- 
tion-sliders animation). 


| BA 


tal 
ER TE SE 


The seven pieces of Tangram are divided into five isosceles right triangles of three dif- 
ferent sizes, a square and a parallelogram. The game consists in the composition of 
recognizable shapes (animals, people, objects) by translating, rotating and overturn- 
ing the seven given pieces, without overlapping (figs. 04, 05). Therefore, the process re- 
quires shape observation, simplification and stylization skills, as well as the symmetries 
and forms recognition. The rebuilt figures will be equi-composed, therefore equivalent. 
Tangram can be classified into simple and complex. The simple puzzle solution is based 
on the combination of translations and rotations to compose a single region; the solu- 
tion of complex puzzles presents several components of the same type, holes, un- 
constrained rotations and parallelogram mirroring [Yamada et al. 2020]. The scientif- 
ic literature demonstrates that Tangram is used for mind training to identify, classify and 
analyze shape [Renavitasari et al. 2018; Zhu et al. 2015]. The solution of a Tangram puz- 
zle is inevitably associated with cognitive and imaginative abilities and visual intelligence. 
With reference to the field of mathematical sciences, Tangram is used to support and de- 
velop students’ spatial skills. Therefore, Tangram represents an opportunity for the devel- 
opment of STEM-type skills in the recreational-educational field. Abstract diagrams, includ- 
ing icons and symbols, support awareness and communication of real-world complexity. 
Beyond the didactic field, Tangram is used in the medical field, e.g. for the development 
of visual re-education methods, or as a support tool for children and adolescents suf- 
fering from neurodevelopmental disorders NDD_ Neuro-Developmental Disorder, in- 
cluding Attention Deficit Hyperactivity Disorder (ADHD), Autism Spectrum Disorder 
(ASD) and Down Syndrome [Gelsomini et al. 2019]. Furthermore, the basic mech- 
anism of human behavior in shape recognition/composition (e.g. Tangram game) repre- 
sents a basic digital automatic process for training neural networks [Zaho et al. 2021]. 
In this regard, the thematic literature reports data on the maximum times necessary for the 
resolution of the Tangram puzzles by a sample of adult participants, distinguishing between 
digital Tangram and hand Tangram [Baran 2019]. Therefore, developing quick tools to find 
automatic solutions could facilitate the development of new tools. 
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Fig. 04. Square Tangram. 


Fig. 05. Tangram variants: 
square, oval, heart, 
circular. Left, GARN- 
TAM variant, designed 
by D'Ambrosio, R., 
model filed in 1986 
(n.52612b/86); right, 
reworking composition 
from Slocum, J., Gebhardt, 
D. (2022). The Anchor 
Puzzle Book. Indiana 
University Press. 


Below, the workflow defined for the decomposition/recomposition and rapid animation of 
complex planar figures: 

- image/scene semantic decomposition (subjects, objects, background elements); 

- identification of useful parameters for the semantic decomposition of a figure: texture/ 
color (image sampling / clustering); 

- sampling/paneling (triangular, quadrangular and hexagonal pattern) of homogeneous and 
extended areas (e.g. background elements), (figs. 06, 07); 

- semi regular tessellation of complex profiles (fig. 03); 

- nesting of a figures dataset (Tangram puzzle), (figs. 08, 09); 

- figure discretization based on kinematic algorithm definition: 

- animated GIF creation; 

- QR code creation (text interactivity). 
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Fig. 06. Semantic decom- 
position of an image 


(figure + background). 
Discretization technique 
based on distinction 
between individual 
profile and homogeneous 
background areas. 


Fig. 07. Image Sampling/ 
pixelation of homoge- 
neous regions. Semantic 
decomposition of the 
image (figure + back- 
ground) based on color 
parameter 


Therefore, according to the previous premises, irregular patterns (e.g. Voronoi) are ob- 
viously excluded because they are made up of infinitely different pieces, condition that 
denies the resolution of the problem with a given dataset of pieces. 

Solving a Tangram puzzle is a problem strongly analogous to the packaging process of 
a two-dimensional irregular shape (NP problem-hard_nondetermistic polynomial-time 
hard problem) [Yamada 2019], comparable with C&P, Cutting and Packaging processes 
or, therefore, with Nesting processes, that is (to) nest “nesting” of parts within a com- 
plex two-dimensional profile/container. 

Nesting is defined as the efficient distribution of multiple shapes over a given area. 
The software (open source) tested for the following Nesting applications of the tans wi- 
thin regions obtained by simplifying objects are OpenNest and Nest & Cut (figs. 08, 09). 
The basic workflow for solving Tangram puzzles using tans nesting within complex 
regions are: 

- identification/isolation of the profile to be reassembled; 

- upload of tans within the open source platform (Nest & Cut)/VPL definition (e.g. 
OpenNest); 

- upload of region/profiles for tans Nesting; 

- setting of optimization parameters (tans distance = 0, times); 

- Nesting. 
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Fig. 08. Nest & Cut 
software screen. Nesting 
test for the automatic 
discretization of complex 
profiles. Tans (pieces) 
and slab (swan profile) 
upload. 


Fig. 09. Progressive 
simplification of the swan 
shape (cutting plate) to 
facilitate the automatic 
nesting of the tans inside 
the profile. Software: Nest 
& Cut. 
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Applications: animated GIFs + QR code for Digital Storytelling 


The animated GlFs, usable through QR codes on paper supports (texts, panels, etc.) 
or activated through special widgets (digital texts), facilitate the communication of a 
message. Then, in the VPL environment, single complex figures or compositions were 
animated and discretized with simple figures. The animation of sliders allows the tran- 
slation of the kinematic algorithms into a sequence of frames to create an animated 
GIF (figs. 00, 10). 

Hence, it is possible to animate multiple sliders or combine multiple animated GIFs to 
compose a dynamic scene. The workflow consists of the following steps: 

- discretization of the starting profiles/regions, background + figure (Paneling/Image Sam- 
pling-Nesting/Tangram); 

- kinematics parametrization of a polygons composition (action performed by figure); 

- sliders animation to generate a frames sequence for animated GIF; 

- OR code for animation; 

- insertion of the QR code within texts or use of animated GIFs for the creation of 
digital products. 
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Fig. 10. Kinematics 
(compound motion) of a 


polygon (rotation + tran- 


slation). Polygon overlay 
on swan silhouette 
(Tangram puzzle). 


Fig. | |. Swan wing discre- 
tization and kinematics. 
Adaptation of Jansen's 
locomotion algorithm 

to simulate dynamic 
configuration. 


The applications shown in this contribution are produced by students of the Digital Drow- 
ing and Parametric Modeling Laboratory of Community Design Degree Course, Department 
of Architecture of the Federico Il University of Naples. In particular, the VPL algorithm gen- 
erated by the students parameterizes the terrestrial locomotion mechanism of the kinetic 
sculptures of the Dutch artist Theo Jansen (1948), based on the use of evolutionary algo- 
rithms necessary for the comparison between thousands of possible motion configurations. 
The students tested this tool (discretization of the figures and design of the connections) 
on different figures (figs. 10, | 1, 12). 


ANIMAZIONE 


Gif animata 


Fig. | 2. Discretization and 
kinematics of a butterfly 
profile. Adaptation of 
Jansen's locomotion 
algorithm to simulate 
dynamic configuration. 


Gif animata 4 5 6 


Conclusions and Future Works 


The goal of the VPL experiments proposed within this contribution is, therefore, to test 
and merge consolidated digital procedures to contribute / facilitate the creation of playful / 
educational products (animated GIFs, videos) in support of analog or digital texts, accessible 
through QR code or widgets (Digital Storytelling). 

Parameterizing new kinematics, extending the semantic decomposition process of shape 
from planar tessellation (plane figures) to spatial tessellation (compositions of polyhedra) 
and involving VPL genetic algorithms to optimize shape decomposition/recomposition pro- 
cesses represent possible, future research works. 
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